<#--
	@Dependence common
-->

<#macro container name='' namePrefix='' label='' vertical=true freeModel=false columnCount=1 clazz='' style='' bgImage=''
	minWidth=0 labelWidth=0 itemWidth='' colspan=1 model='' positionCol=-1 id=''>
	<#local cid = tag.getCid(name, 'container')>
	<#assign _namePrefix = tag.pushNamePrefix(action, namePrefix)>
	<#assign pminWidth=minWidth>
	
	<#-- push ps -->
	<#local shortName = tag.getShortName(name)>
	<#local _ps = ps>
	<#assign ps = ps.checkAddElement(shortName, name, 'container', {})>
	<#if _ps.length?? && _ps.length gt 0>
		<#assign pminWidth=_ps.length>
	</#if>
	
	<#local headHeight = 0>
	<#if label!=''>
		<#local headHeight = 32>
	</#if>
	<#local height = tag.ncss('', style, 'height', -headHeight-2)>
	<div<#if id!=''> id="${id}"</#if> class="jcontainer<#if vertical> vertical</#if> stdEle stdCtn ${clazz} ${cid}" name="${shortName}" fullName="${name}" uiType="container"
		style="${style}<#if pminWidth!=0>;min-width:${pminWidth}px</#if><#if bgImage!=''>;background-image:url(${base}${bgImage})</#if>"
		<#if positionCol != -1> positionCol='${positionCol}'</#if>
		columnCount="${columnCount}" labelWidth="${labelWidth}" itemWidth="${itemWidth}" <#if colspan gt 1>colspan="${colspan}"</#if> vertical="${vertical?string}">
		<#if label!=''><h3><a href='#'><label class="label"><@i18n name=label/></label></a></h3></#if>
		<div class="jcontainer-body<#if freeModel> freeCtn</#if> columnCount${columnCount} ctnEle" <#if height gt 0>style="height:${height}px"</#if>>
			<#if columnCount==1 && vertical><div class="colEle jcontainer-column columnFirst"></#if>
			<#nested>
			<#if columnCount==1 && vertical></div></#if>
		</div>
	</div>
	<@script _inner=true>initContainer(j171('.${cid}'), ${vertical?string});</@script>
	
	<#-- popup ps -->
	<#assign ps = _ps>
	<#assign _namePrefix = tag.popNamePrefix(action, namePrefix)>
	
	<@inject name='container.jui' point='header' type='html' priority=2 once=true>
		<@css src="/static/espirit/styles/jquery-ui-1.8.18.custom.css"/>
		<@script src="/static/espirit/scripts/jquery-ui-1.8.18.custom.js" async=true/>
	</@inject>
</#macro>

<#macro tab name='' namePrefix='' labels=[] urls=[] selected=-1 vertical=false clazz='' style='' enableClose=false cache=true model='' id=''>
	<#local cid = tag.getCid(name, 'tab')>
	<#assign _namePrefix = tag.pushNamePrefix(action, namePrefix)>
	<#local shortName = tag.getShortName(name)>
	<#local _ps = ps>
	<#assign ps = ps.checkAddElement(shortName, name, 'tab', {})>
	
	<div<#if id!=''> id="${id}"</#if> name='${shortName}' fullName='${name}' class="jtab stdEle stdCtn ${clazz} ${cid}" uiType="tab" style="display: none;${style}">
		<ul class="tabHeader"></ul>
		<#if labels?size gt 0>
			<#list labels as label>
				<#assign tabpageName = shortName + '_' + label_index>
				<@tabpage name=tabpageName label=label url=urls[label_index] enableClose=enableClose/>
			</#list>
		</#if>
		<#nested>
	</div>
	
	<@script _inner=true>
		when('initTabs', 'j171.fn.tabs', function() {
			initTabs(j171(".${cid}"), ${cache?string}, ${enableClose?string}, ${selected}, '', ${vertical?string});
		});
	</@script>
	
	<#assign ps = _ps>
	<#assign _namePrefix = tag.popNamePrefix(action, namePrefix)>
	
	<@inject name='container.jui' point='header' type='html' priority=2 once=true>
		<@css src="/static/espirit/styles/jquery-ui-1.8.18.custom.css"/>
		<@script src="/static/espirit/scripts/jquery-ui-1.8.18.custom.js" async=true/>
	</@inject>
</#macro>

<#macro tabpage name='' namePrefix='' label='' url='' clazz='' style='' enableClose=false model='' id=''>
	<#assign _namePrefix = tag.pushNamePrefix(action, namePrefix)>
	<#--TODO: enable pElement? -->
	
	<#if url == '' || ps.isMock()>
		<#local tabpageId = '_tab_' + fn.id>
		<#local linkWithBase = '#' + tabpageId>
	<#else>
		<#local linkWithBase = tag.formatLink(url, ps, true)>
		<#-- TODO: add the ps of the link page to current ps? -->
	</#if>
	
	<#if linkWithBase != ''>
		<#local shortName = tag.getShortName(name)>
		<li<#if id!=''> id="${id}"</#if> name='${shortName}' fullName='${name}' 
			class="tabHeaderTitle stdEle<#if enableClose> withCloseLink</#if>" style='${style}' uiType='tabpage'>
			<a href="${linkWithBase}" label="<@i18n name=label/>" class="title label"><@i18n name=label/></a>
			<#if enableClose>
				<a href='javascript:void(0)' onclick='closeTab(this)' class="closeLink"><span class='ui-icon ui-icon-close'><@i18n name='commons.closeTab'/></span></a>
			</#if>
		</li>
	</#if>
	
	<#if tabpageId?exists>
		<div class="j-hide-display stdCtn jcontainer-body" fullName='${name}' id='${tabpageId}' uiType='tabpage'>
			<#nested>
		</div>
	<#else>
		<#nested>
	</#if>
	
	<#assign _namePrefix = tag.popNamePrefix(action, namePrefix)>
</#macro>

<#include "container.pageinfo.ftl">

<#include "container.dpageinfo.ftl">

<#include "container.datagrid.ftl">

<#macro span name value='' label='' textModel=false required=false show=true clazz='' style='' width=0 colspan=1 id=''>
	<@control type='span' id=id name=name value=value width=width label=label clazz=clazz style=style required=required colspan=colspan show=show textModel=textModel>
		<#nested>
	</@control>
</#macro>

<#--
	@Private
-->
<#macro dlayout name='' north=false west=false center=true east=false south=false initCondition='' clazz='' id=''>
	<#local cid = tag.getCid(name, 'dlayout')>
	<#local shortName = tag.getShortName(name)>
	<#local _ps = ps>
	<#assign ps = ps.checkAddElement(shortName, name, 'layout', {})>
	
	<#assign layout_north=north>
	<#assign layout_west=west>
	<#assign layout_center=center>
	<#assign layout_east=east>
	<#assign layout_south=south>
	<div<#if id!=''> id="${id}"</#if> name="${shortName}" fullName="${name}" class="jdlayout stdEle stdCtn ${clazz} ${cid}" uiType="dlayout"><#nested></div>
	<@script _inner=true>
		when('initDLayout', 'j171.fn.layout', '${initCondition}', function() {
			initDLayout(".${cid}", ${north?string}, ${west?string}, ${center?string}, ${east?string}, ${south?string});
		});
	</@script>
	
	<#assign ps = _ps>
	
	<@inject name='container.dlayout' point='header' type='html' priority=2 once=true>
		<@script src="/static/espirit/scripts/jquery.layout-1.2.0.js"/>
		<@script src="/static/espirit/scripts/jquery.autosize.js"/>
	</@inject>
</#macro>

<#assign tmp = ps.safeContext().addCssCategory('common')>